<template>
	<view :style="{width:width}"  class="meg-voi">
		<template v-if="item.isSelf">
			<progress   :percent="progress" stroke-width="3" />
			<text class="duration">{{ item.duration }}</text><!-- {{ item.duration }}'' -->
			<u-icon name="play-circle-fill"></u-icon>
		</template>
		
		<template v-else>
			<progress :percent="progress" stroke-width="3" />
			<u-icon name="play-circle-fill"></u-icon>
			<text class="duration"> {{ item.duration }}</text><!-- {{ item.duration }}'' -->
		</template>
	</view>
</template>

<script>

export default{
	data(){
		return{
		}
	},
	props:{
		item:{
			type:Object,
			default:()=>{
				return {}
			}
		}
	},
	
	computed:{
		url(){
			return this.item.url
		},
		width(){
			let w=this.item.duration*2+25
			/* if(w<50){
				w=50
			} */
			return w+'px'
		},
		progress(){
			return this.item.progress||0
		}
	},
	watch:{
		
	},
	created:function(){
		
	},
	methods:{
		
		
	}
}
</script>

<style scoped>
	
</style>
